<template>
	<el-card>
		<div slot="header">
			<span>管理员编辑</span>
		</div>
		<el-form ref="form" :model="form" label-width="80px">
			<el-form-item label="用户名">
				<el-input v-model="form.username"></el-input>
			</el-form-item>
			<el-form-item label="姓名">
				<el-input v-model="form.fullname"></el-input>
			</el-form-item>

			<el-form-item label="性别">
				<el-radio-group v-model="form.sex">
					<el-radio label="男"></el-radio>
					<el-radio label="女"></el-radio>
				</el-radio-group>
			</el-form-item>
			<el-form-item label="手机">
				<el-input v-model="form.tel"></el-input>
			</el-form-item>
			<el-form-item label="邮箱">
				<el-input v-model="form.email"></el-input>
			</el-form-item>
			<el-form-item label="图片">
				<Upload_Picture v-model="form.avatar" :data="{ type: 'avatar' }"></Upload_Picture>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="handleEdit">保存修改</el-button>
			</el-form-item>
		</el-form>
	</el-card>
</template>

<script>
import { Admin, Role } from '@/api';
import { mapState, mapActions } from 'vuex';
import Upload_Picture from '@/plugins/upload-picture.vue';
export default {
	name: 'Edit',
	components: {
		Upload_Picture,
	},
	created() {
		this.form = { ...this.profile };
	},
	data() {
		return {
			form: {
				user_id: '',
				username: '',
				fullname: '',
				sex: '',
				tel: '',
				email: '',
				avatar: '',
			},
		}
	},
	computed: {
		...mapState('account', ['profile']),
	},
	methods: {
		...mapActions('account', ['edit_profile']),
		//保存修改
		async handleEdit() {
			// this.$refs.form.validate(async () => {
			// 	if (valid) {
					let { status, msg } = await this.edit_profile({ ...this.form });
					if (status) {
						this.$message.success(msg);
					} else {
						this.$message.error(msg);
					}
				}
		// 	});
		// },
	},
}
</script>

